<template>
 <div id="app">
    <!-- v-text和v-html，分别设置textContent、innerHTML -->
    <!-- v-text或者v-html会覆盖内容的插值 -->
<!-- v-text可以解析文字 不能解析标签 --> <!-- v-text可以解析文字 不能解析标签 -->
<p v-text="text">{{}}</p>
<p v-text="text1">{{}}</p>
 <!-- v-html可以解析内容中的html -->
<p v-html="html">{{}}</p>

 </div>

</template>

<script>
export default {
 name: "App",
 // 插值表达式使用的变量放在data函数的返回对象里
 data() {
  return{
text:"解析文本",
html:"<span>插入解析标签</span>",
text1:"<button>按钮</button>",
 }
 }
};
</script>

<style>
div {
color: plum; text-align: center;
}

</style>
